I am having trouble recreating the issue. I tried with both https://edgeapi.rubyonrails.org/ and https://deploy-preview-308--sdoc.netlify.app/ (the most recent preview for main) using Safari on iOS.

What is your setup like?

@jonathanhefner I'm on OSX. This happens with Firefox and Chrome. Safari handles it properly.

I'm on OSX. This happens with Firefox and Chrome. Safari handles it properly.

Hmm, that is tricky. On Linux, Firefox and Chrome don't natively support overscroll. I can configure Firefox to support overscroll by setting apz.overscroll.enabled to true in about:config, but I still can't reproduce the issue, so something must be missing. And I haven't found a way to configure Chrome to support overscroll.

As you probably noticed in the preview, setting position: fixed removes .banner from the flow, causing other layout issues.

Shot in the dark: instead of adding position: fixed to .banner, if you add top: var(--banner-height) to .panel__tray does the issue still occur?